<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../jquery.min.js"></script>
</head>
<body>
    <button class="btnGet">点击发送get请求</button>
    <button class="btnPost">点击发送post请求</button>
    <button class="btndel">点击发送del请求</button>
    <button class="btnput">点击发送put请求</button>
    <button class="btnjsonp">点击发送jsonp请求</button>
  

    <script>
        $(function () {
            // get 请求
            $('.btnGet').click(function () {
                $.ajax({
                    url: 'http://localhost:8080/home',
                    data: {
                        sex: "男",
                        age: '22'
                    },
                    success: function (res) {
                        console.log(res);
                    }
                })
            })


            //  post 请求
            $('.btnPost').click(function () {
                $.ajax({
                    url: 'http://localhost:8080/add',
                    type: "post",
                    data: {
                        sex: "男",
                        age: '22',
                        hobbies: ['篮球', '足球', '排球', '气球']
                    },
                    success: function (res) {
                        console.log(res);
                    }
                })
            })
            

             //delete 请求
            $('.btndel').click(function () {
                $.ajax({
                    url: 'http://localhost:8080/delete',
                    type: "delete",
                    data: {
                        sex: "男",
                        age: '22',
                        hobbies: ['篮球', '足球', '排球', '气球']
                    },
                    success: function (res) {
                        console.log(res);
                    }
                })
            })
           
            // put 请求
            $('.btnput').click(function () {
                $.ajax({
                    url: 'http://localhost:8080/put',
                    type: "put",
                    data: {
                        sex: "男",
                        age: '22',
                        hobbies: ['篮球', '足球', '排球', '气球']
                    },
                    success: function (res) {
                        console.log(res);
                    }
                })
            })

            //jsonp 接口 
            $('.btnjsonp').click(function(){
                $.ajax({
                    method:"get",
                    url: 'http://localhost:8080/jsonp',
                    dataType:"jsonp",
                    // jsonpCallback:"xxxx", // 把默认的callback 改成了xxxx
                    success:function(res) {
                        console.log(res);
                    }
            })
            })
        })
    </script>
</body>
</html>